﻿
@{
    ViewBag.Title = "OrderView";
    Layout = "~/Views/ByJuYe/BuJuYe.cshtml";
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>PlaceOrderView</title>
    <link href="~/lib/layui/css/layui.css" rel="stylesheet" />

    <link href="~/lib/JSuan/css/public.css" type="text/css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="~/lib/JSuan/css/base.css" />
    <script type="text/javascript" src="~/lib/JSuan/js/jquery_cart.js"></script>
    <link rel="stylesheet" type="text/css" href="~/lib/JSuan/css/checkOut.css" />
</head>
<body>





    <!-- NAVIGATION -->
    <div id="navigation">
        <!-- container -->
        <div class="container">
            <div id="responsive-nav">
                <!-- category nav -->
                <div class="category-nav show-on-click">
                    <span class="category-header">Categories <i class="fa fa-list"></i></span>
                    <ul class="category-list">
                        <li class="dropdown side-dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Women’s Clothing <i class="fa fa-angle-right"></i></a>
                            <div class="custom-menu">
                                <div class="row">
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="row hidden-sm hidden-xs">
                                    <div class="col-md-12">
                                        <hr>
                                        <a class="banner banner-1" href="#">
                                            <img src="~/FrontDesk/img/banner05.jpg" alt="">
                                            <div class="banner-caption text-center">
                                                <h2 class="white-color">NEW COLLECTION</h2>
                                                <h3 class="white-color font-weak">HOT DEAL</h3>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li><a href="#">Men’s Clothing</a></li>
                        <li class="dropdown side-dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Phones & Accessories <i class="fa fa-angle-right"></i></a>
                            <div class="custom-menu">
                                <div class="row">
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                    <div class="col-md-4 hidden-sm hidden-xs">
                                        <a class="banner banner-2" href="#">
                                            <img src="~/FrontDesk/img/banner04.jpg" alt="">
                                            <div class="banner-caption">
                                                <h3 class="white-color">NEW<br>COLLECTION</h3>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li><a href="#">Computer & Office</a></li>
                        <li><a href="#">Consumer Electronics</a></li>
                        <li class="dropdown side-dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Jewelry & Watches <i class="fa fa-angle-right"></i></a>
                            <div class="custom-menu">
                                <div class="row">
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li><a href="#">Bags & Shoes</a></li>
                        <li><a href="#">View All</a></li>
                    </ul>
                </div>
                <!-- /category nav -->
                <!-- menu nav -->
                <div class="menu-nav">
                    <span class="menu-header">Menu <i class="fa fa-bars"></i></span>
                    <ul class="menu-list">
                        <li><a href="#">Home</a></li>
                        <li><a href="#">Shop</a></li>
                        <li class="dropdown mega-dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Women <i class="fa fa-caret-down"></i></a>
                            <div class="custom-menu">
                                <div class="row">
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                        <hr class="hidden-md hidden-lg">
                                    </div>
                                    <div class="col-md-4">
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="row hidden-sm hidden-xs">
                                    <div class="col-md-12">
                                        <hr>
                                        <a class="banner banner-1" href="#">
                                            <img src="~/FrontDesk/img/banner05.jpg" alt="">
                                            <div class="banner-caption text-center">
                                                <h2 class="white-color">NEW COLLECTION</h2>
                                                <h3 class="white-color font-weak">HOT DEAL</h3>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="dropdown mega-dropdown full-width">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Men <i class="fa fa-caret-down"></i></a>
                            <div class="custom-menu">
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class="hidden-sm hidden-xs">
                                            <a class="banner banner-1" href="#">
                                                <img src="~/FrontDesk/img/banner06.jpg" alt="">
                                                <div class="banner-caption text-center">
                                                    <h3 class="white-color text-uppercase">Women’s</h3>
                                                </div>
                                            </a>
                                            <hr>
                                        </div>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="hidden-sm hidden-xs">
                                            <a class="banner banner-1" href="#">
                                                <img src="~/FrontDesk/img/banner07.jpg" alt="">
                                                <div class="banner-caption text-center">
                                                    <h3 class="white-color text-uppercase">Men’s</h3>
                                                </div>
                                            </a>
                                        </div>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="hidden-sm hidden-xs">
                                            <a class="banner banner-1" href="#">
                                                <img src="~/FrontDesk/img/banner08.jpg" alt="">
                                                <div class="banner-caption text-center">
                                                    <h3 class="white-color text-uppercase">Accessories</h3>
                                                </div>
                                            </a>
                                        </div>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="hidden-sm hidden-xs">
                                            <a class="banner banner-1" href="#">
                                                <img src="~/FrontDesk/img/banner09.jpg" alt="">
                                                <div class="banner-caption text-center">
                                                    <h3 class="white-color text-uppercase">Bags</h3>
                                                </div>
                                            </a>
                                        </div>
                                        <hr>
                                        <ul class="list-links">
                                            <li>
                                                <h3 class="list-links-title">Categories</h3>
                                            </li>
                                            <li><a href="#">Women’s Clothing</a></li>
                                            <li><a href="#">Men’s Clothing</a></li>
                                            <li><a href="#">Phones & Accessories</a></li>
                                            <li><a href="#">Jewelry & Watches</a></li>
                                            <li><a href="#">Bags & Shoes</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li><a href="#">Sales</a></li>
                        <li class="dropdown default-dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">Pages <i class="fa fa-caret-down"></i></a>
                            <ul class="custom-menu">
                                <li><a href="index.html">Home</a></li>
                                <li><a href="products.html">Products</a></li>
                                <li><a href="product-page.html">Product Details</a></li>
                                <li><a href="checkout.html">Checkout</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <!-- menu nav -->
            </div>
        </div>
        <!-- /container -->
    </div>
    <!-- /NAVIGATION -->
    <!-- BREADCRUMB -->
    <div id="breadcrumb">
        <div class="container">
            <ul class="breadcrumb">
                <li><a href="#">主页</a></li>
                <li class="active">用户中心</li>
                <li class="active">订单列表</li>
            </ul>
        </div>
    </div>
    <!-- /BREADCRUMB -->
    <!-- section -->
    <div class="section">
        <div>
            <div class="container">
                <div class="checkout-box">
                    <form id="checkoutForm" action="#" method="post">
                        <div class="checkout-box-bd">
                            <!-- 地址状态 0：默认选择；1：新增地址；2：修改地址 -->
                            <input type="hidden" name="Checkout[addressState]" id="addrState" value="0">
                            <!-- 收货地址 -->
                            <div class="xm-box">
                                <div class="box-hd ">
                                    <h2 class="title">收货地址</h2>
                                    <!---->
                                </div>
                                <div class="box-bd">
                                    <div class="clearfix xm-address-list" id="checkoutAddrList">
                                        <dl class="item UserAddress" id="1">
                                            <dt>
                                                <strong class="itemConsignee">潘骏杰</strong>
                                                <span class="itemTag tag">家</span>
                                            </dt>
                                            <dd>
                                                <p class="tel itemTel">15961726437</p>
                                                <p class="itemRegion">江苏 无锡市 北塘区</p>
                                                <p class="itemStreet">民丰西苑82号202室(214045)</p>
                                                <span class="edit-btn J_editAddr">编辑</span>
                                            </dd>
                                            <dd style="display:none">
                                                <input type="radio" name="Checkout[address]" class="addressId" value="10140916720030323">
                                            </dd>
                                        </dl>
                                        <div class="item use-new-addr" id="J_useNewAddr" data-state="off">
                                            <span class="iconfont icon-add"><img src="~/lib/JSuan/images/add_cart.png" /></span>
                                            使用新地址
                                        </div>
                                    </div>


                                </div>
                            </div>
                            <!-- 收货地址 END-->
                            <div id="checkoutPayment">
                                <!-- 支付方式 -->
                                <div class="xm-box">
                                    <div class="box-hd ">
                                        <h2 class="title">支付方式</h2>
                                    </div>
                                    <div class="box-bd">
                                        <ul id="checkoutPaymentList" class="checkout-option-list clearfix J_optionList">
                                            <li class="item selected">
                                                <input type="radio" name="Checkout[pay_id]" checked="checked" value="1">
                                                <p>
                                                    在线支付 <span></span>
                                                </p>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <!-- 支付方式 END-->
                                <div class="xm-box">
                                    <div class="box-hd ">
                                        <h2 class="title">配送方式</h2>
                                    </div>
                                    <div class="box-bd">
                                        <ul id="checkoutShipmentList" class="checkout-option-list clearfix J_optionList">
                                            <li class="item selected">
                                                <input type="radio" data-price="0" name="Checkout[shipment_id]" checked="checked" value="1">
                                                <p>
                                                    快递配送（免运费） <span></span>
                                                </p>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="checkout-box-ft">
                            <!-- 商品清单 -->
                            <div id="checkoutGoodsList" class="checkout-goods-box">
                                <div class="xm-box">
                                    <div class="box-hd">
                                        <h2 class="title">确认订单信息</h2>
                                    </div>
                                    <div class="box-bd">
                                        <dl class="checkout-goods-list">
                                            <dt class="clearfix">
                                                <span class="col col-1">商品名称</span>
                                                <span class="col col-2">购买价格</span>
                                                <span class="col col-3">购买数量</span>
                                                <span class="col col-4">小计（元）</span>
                                            </dt>
                                            @foreach (var item in ViewBag.ListShop)
                                            {
                                                <dd class="item clearfix">
                                                    <div class="item-row">
                                                        <div class="col col-1">
                                                            <div class="g-pic">
                                                                <img src="@ViewBag.AdminUrl@item.ShopImage" style="max-height:60px;max-width:90px;" />
                                                            </div>
                                                            <div class="g-info">
                                                                <a href="#">
                                                                    @item.ShopName
                                                                </a>
                                                            </div>
                                                        </div>
                                                        <div class="col col-2">@item.Price 元</div>
                                                        <div class="col col-3">@item.ShopNum</div>
                                                        <div class="col col-4">@item.Total 元</div>
                                                    </div>
                                                </dd>
                                            }

                                        </dl>
                                        <div class="checkout-count clearfix">
                                            <!-- checkout-count-extend -->
                                            <div class="checkout-price">
                                                <ul>
                                                    <li>
                                                        订单总额：<span>244元</span>
                                                    </li>
                                                    <li>
                                                        优惠券抵扣：<span id="couponDesc">-0元</span>
                                                    </li>
                                                    <li>
                                                        运费：<span id="postageDesc">0元</span>
                                                    </li>
                                                </ul>
                                                <p class="checkout-total">应付总额：<span><strong id="totalPrice">244</strong>元</span></p>
                                            </div>
                                            <!-- checkout-count-extend -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="checkout-confirm">
                                <a href="#" class="btn btn-lineDakeLight btn-back-cart">返回购物车</a>
                                <input type="submit" class="btn btn-primary" value="立即下单" id="subBtn" />
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- /section -->
    <script src="~/lib/layui/layui.js"></script>
    <script>
        layui.use(['layer'], function () {
            var $ = layui.$;
            var layer = layui.layer;
            var carts = "";
            var address = "";
            //$(".CheckDetail").click(function () {
            //    var con = this.name;
            //    location.href = "/UserCenter/OrderDetailView?id=" + con;
            //});
            $(".carts").click(function () {
                carts += this.id + ",";
                $("#cd").val(carts);
            });
            $(".UserAddress").click(function () {
                var addressId = this.id;
                console.log(123);
                console.log(addressId);
                $.ajax({
                    url: "/Cart/GetAddress",
                    type: "post",
                    data: { id: addressId },
                    success: function (re) {
                        if (re.success) {
                            address = re.data;
                            console.log(address);
                        } else {
                            layer.msg("发生了未知错误");
                        }
                    }
                });
                return false;
            });
            //下单===============================================
            $("#subBtn").click(function () {

                $.ajax({
                    url: "/Cart/PlaceOrder",
                    type: "post",
                    data: { cartIds: carts, Address: "" },
                    success: function (re) {
                        if (re.success == 3) {
                            layer.msg(re.msg);
                        } else if (re.success > 0) {
                            layer.msg(re.msg);
                        } else {
                            layer.msg(re.msg);
                        }
                    }
                });
            });
            //===============================
            $("#UserAddressAdd").click(function () {
                console.log(123123);
                layer.open({
                    type: 2,
                    title: '新增地址'
                    , content: '/Cart/AddUserAddressView'
                });

            });



            //===================================
        });
    </script>
    <script>
        //Demo
        layui.use('form', function () {
            var form = layui.form;

            //监听提交
            form.on('submit(formDemo)', function (data) {
                layer.msg(JSON.stringify(data.field));
                return false;
            });
        });
    </script>
</body>
</html>
